<?php echo $this->render('cabecera.phtml'); ?>

<div id="content" class="row-fluid">

<!--/menu izquierdo -->
<div class="span3">
    <div class="well sidebar-nav">
        <ul class="nav nav-list">
            <br>
            <center><?php echo $this->render('logo.phtml'); ?></center>
            <br>
            <div class="alert alert-resaltar">
                <li class="nav-header">OPCIONES:</li>
                <li><a href="<?php echo $this->baseUrl ?>/">Volver</a></li>
            </div>
            <br>
            <center><?php echo $this->render('facebook.phtml'); ?></center>
            <br>
        </ul>
    </div><!--/.well -->
</div><!--/span-->

<!--/panel derecho "contenido" -->
<div class="span9">
        <div class="hero-unit">
            <center><h2>Lista de Carreras</h2></center>
        </div>
        <?php if ($this->cliente) { ?>
            <?php if ($this->cliente->role == "admin" || $this->cliente->role == "adminCarreras") { ?>
                <div class="alert alert-info">
                    <h2>Opciones de Administrador</h2>
                        <br>
                        <a href="<?php echo $this->url(array(
                            'module'=>'default',
                            'controller'=>'carreras',
                            'action'=>'crear'));?>"
                        class="btn btn-large btn-warning">Crear una carrera nueva</a>
                </div>
            <?php } ?>
        <?php } ?> 
        <br>
        <!-- empieza el div para onload -->
        <center><div id="div_espera" style="padding-top: 10%;">
                    <img src="/ceis/img/img_carga.gif"/>
        </div></center>
        <div id="div_onload" style="display: none">
        <!-- empieza el div para onload -->
            <div id="accordion2" class="accordion">
                <?php foreach($this->carreras as $carrera) : ?>
                    <div class="accordion-group">
                        <div class="accordion-heading">
                            <a class="accordion-toggle" 
                            href="#carrera_<?php echo $carrera->id ?>" 
                            data-parent="#accordion2" data-toggle="collapse"> 
                                <h2><?php echo $carrera->nombre ?></h2>
                            </a>
                        </div>
                        <div id="carrera_<?php echo $carrera->id ?>" 
                            class="accordion-body collapse" style="height: 0px;">
                            <div class="accordion-inner"> 
                                <?php include 'carrera.phtml' ?>
                            </div>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>
        <!-- termina el div para onload -->
        </div>
        <!-- termina el div para onload -->
</div><!--/span-->

</div><!--/contentrow-->

<?php echo $this->render('pie.phtml'); ?>

<script>
    window.onload = function(){
        $("#div_onload").show();
        $("#div_espera").hide();
        /* sin esto no se ven las imagenes en google chrome*/
        $(".collapse img").collapse('show');
    }
</script>